import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Input, Modal, InputNumber, Upload, Button, Icon, Select, Radio, Card,Row, Col, Checkbox,message,Divider} from 'antd';
import { formatMessage } from 'umi-plugin-react/locale';
import { FormComponentProps } from '@ant-design/compatible/es/form';
import React, { useState } from 'react';
import { queryRule, updateRule, addRule, removeRule } from '../service';
import styles from '../style.less';
import LangForm from './LanguageForm';
import DataLang from './DataLang';
// 导入自定义组件1
import PreviewForm from '@/components/PreviewForm';
import * as BdHelper from '@/utils/BdHelper';
import * as DataHelper from '@/helpers/DataHelper';
import * as TsxHelper from '@/helpers/TsxHelper';

// 常量
const { TextArea } = Input;
const FormItem = Form.Item;

// 定义: 数据表单属性
interface DataFormProps extends FormComponentProps {
  // dataModalVisible: boolean;
  isUpdate: boolean
  dataFormValues: any
  common: any
}

// 数据表单
const DataForm: React.FC<DataFormProps> = props => {
  // 组件属性
  const { form, common, isUpdate, dataFormValues } = props;

  // 图片状态
  const [picture, setPicture] = useState<any[]>([]);
  const [uploadChanged, setUploadChanged] = useState<boolean>(false);
  const [pictureLogo, setPictureLogo] = useState<any[]>([]);
  const [uploadLogoChanged, setUploadLogoChanged] = useState<boolean>(false);
  const [previewModelVisible, handlePreviewModalVisible] = useState<boolean>(false);
  const [previewImg, setPreviewImg] = useState('');
  const [langModalVisible, handleLangModalVisible] = useState<boolean>(false);
  const [dataValue, setDataValue] = useState<any>({});
  const [dataLangModalVisible, handleDataModalVisible] = useState<boolean>(false);
  const [fieldTitle, setFieldTitle] = useState<any>('');
  const [modalName, setModalName] = useState<any>('');
    //提交表单
    const okHandle = () => {
      form.validateFields((err, fieldsValue) => {
        if (err) return;
        if(picture.length > 0){
          fieldsValue.file_id   = picture[0].file_id
          fieldsValue.file_url  = picture[0].file_url
        }
        console.log("submit fields ", fieldsValue)
        var submitValue = [
            {
              //请求当前一组配置参数，tag=renames
              "alias_key": 'renames',
              "item_type":'system',
              "dict_item_arr": [
                {
                  "alias_key": "member_name",
                  "item_value": fieldsValue.member_name,
                  'item_type':"textarea",
                  'lang_json': member_nameJson,
                },
                {
                  "alias_key": "member_id_name",
                  "item_value": fieldsValue.member_id_name,
                  'item_type':"textarea",
                  'lang_json': siteDescJson,
                },
                {
                  "alias_key": "member_name_name",
                  "item_value": fieldsValue.member_name_name,
                  'item_type':"textarea",
                  'lang_json': mnameNameJson,
                },
                {
                  "alias_key": "member_nickname_name",
                  "item_value": fieldsValue.member_nickname_name,
                  'item_type':"textarea",
                  'lang_json': nicknameJson,
                },
                {
                  "alias_key": "member_role_name",
                  "item_value": fieldsValue.member_role_name,
                  'item_type':"textarea",
                  'lang_json': rolenameJson,
                },
                {
                  "alias_key": "group_name",
                  "item_value": fieldsValue.group_name,
                  'item_type':"textarea",
                  'lang_json': groupnameJson,
                },
                {
                  "alias_key": "hashtag_name",
                  "item_value": fieldsValue.hashtag_name,
                  'item_type':"textarea",
                  'lang_json': hashtagnameJson,
                },
                {
                  "alias_key": "post_name",
                  "item_value": fieldsValue.post_name,
                  'item_type':"textarea",
                  'lang_json': postnameJson,
                },
                {
                  "alias_key": "comment_name",
                  "item_value": fieldsValue.comment_name,
                  'item_type':"textarea",
                  'lang_json': commentnameJson,
                },
                {
                  "alias_key": "publish_post_name",
                  "item_value": fieldsValue.publish_post_name,
                  'item_type':"textarea",
                  'lang_json': publish_postnameJson,
                },
                {
                  "alias_key": "publish_comment_name",
                  "item_value": fieldsValue.publish_comment_name,
                  'item_type':"textarea",
                  'lang_json': publish_commentnameJson,
                },
                {
                  "alias_key": "like_member_name",
                  "item_value": fieldsValue.like_member_name,
                  'item_type':"textarea",
                  'lang_json': user_likenameJson,
                },
                {
                  "alias_key": "like_group_name",
                  "item_value": fieldsValue.like_group_name,
                  'item_type':"textarea",
                  'lang_json': group_likenameJson,
                },
                {
                  "alias_key": "like_hashtag_name",
                  "item_value": fieldsValue.like_hashtag_name,
                  'item_type':"textarea",
                  'lang_json': hashtag_likenameJson,
                },
                {
                  "alias_key": "like_post_name",
                  "item_value": fieldsValue.like_post_name,
                  'item_type':"textarea",
                  'lang_json': post_likenameJson,
                },
                {
                  "alias_key": "like_comment_name",
                  "item_value": fieldsValue.like_comment_name,
                  'item_type':"textarea",
                  'lang_json': comment_likenameJson,
                },
                {
                  "alias_key": "follow_member_name",
                  "item_value": fieldsValue.follow_member_name,
                  'item_type':"textarea",
                  'lang_json': user_follownameJson,
                },
                {
                  "alias_key": "follow_group_name",
                  "item_value": fieldsValue.follow_group_name,
                  'item_type':"textarea",
                  'lang_json': group_follownameJson,
                },
                {
                  "alias_key": "follow_hashtag_name",
                  "item_value": fieldsValue.follow_hashtag_name,
                  'item_type':"textarea",
                  'lang_json': hashtag_follownameJson,
                },
                {
                  "alias_key": "follow_post_name",
                  "item_value": fieldsValue.follow_post_name,
                  'item_type':"textarea",
                  'lang_json': post_follownameJson,
                },
                {
                  "alias_key": "follow_comment_name",
                  "item_value": fieldsValue.follow_comment_name,
                  'item_type':"textarea",
                  'lang_json': comment_follownameJson,
                },
                {
                  "alias_key": "shield_member_name",
                  "item_value": fieldsValue.shield_member_name,
                  'item_type':"textarea",
                  'lang_json': user_shieldnameJson,
                },
                {
                  "alias_key": "shield_group_name",
                  "item_value": fieldsValue.shield_group_name,
                  'item_type':"textarea",
                  'lang_json': group_shieldnameJson,
                },
                {
                  "alias_key": "shield_hashtag_name",
                  "item_value": fieldsValue.shield_hashtag_name,
                  'item_type':"textarea",
                  'lang_json': hashtag_shieldnameJson,
                },
                {
                  "alias_key": "shield_post_name",
                  "item_value": fieldsValue.shield_post_name,
                  'item_type':"textarea",
                  'lang_json': post_shieldnameJson,
                },
                {
                  "alias_key": "shield_comment_name",
                  "item_value": fieldsValue.shield_comment_name,
                  'item_type':"textarea",
                  'lang_json': comment_shieldnameJson,
                },
              ]
            }
        ]
        // 如果更新成功之后，重置表单
        updateRule({config_json: JSON.stringify(submitValue)}).then((res:any) => {
          console.log('handleSubmit then success is ', JSON.stringify(submitValue))
          if(res.code == 0){
            message.success('保存成功')
          }
        })
  
      });
    };


    const parseData = (key:any,options:any) => {
      // console.log(options);
      var name:any = {};
      if(Array.isArray(options) && options.length>0){
        options.map(item=>{
          if(item.alias_key == key){
            name = item;
          }
        })
      }
      return name
    }

    const parseLangData = (key:any,options:any) => {
      // console.log(options);
      var name:any = "";
      if(Array.isArray(options) && options.length>0){
        options.map(item=>{
          if(item.alias_key == key){
            name = item?.item_lang;
          }
        })
      }
      return name
    }
  // 初始化变量
  const token = BdHelper.getBdToken()

  const [nameListLang, setnameList] = useState<any>(common?.languagesOption);
  const [member_nameJson, setmember_nameJson] = useState<any>(parseData('member_name',dataFormValues).lang_json_arr || []);
  const [siteDescJson, setSiteDescJson] = useState<any>(parseData('member_id_name',dataFormValues).lang_json_arr || []);
  const [mnameNameJson, setmnameNameJson] = useState<any>(parseData('member_name_name',dataFormValues).lang_json_arr || []);
  const [nicknameJson, setnicknameJson] = useState<any>(parseData('member_nickname_name',dataFormValues).lang_json_arr || []);
  const [rolenameJson, setrolenameJson] = useState<any>(parseData('member_role_name',dataFormValues).lang_json_arr || []);
  const [groupnameJson, setgroupnameJson] = useState<any>(parseData('group_name',dataFormValues).lang_json_arr || []);
  const [hashtagnameJson, sethashtagnameJson] = useState<any>(parseData('hashtag_name',dataFormValues).lang_json_arr || []);
  const [postnameJson, setpostnameJson] = useState<any>(parseData('post_name',dataFormValues).lang_json_arr || []);
  const [commentnameJson, setcommentnameJson] = useState<any>(parseData('comment_name',dataFormValues).lang_json_arr || []);
  const [publish_postnameJson, setpublish_postnameJson] = useState<any>(parseData('publish_post_name',dataFormValues).lang_json_arr || []);
  const [publish_commentnameJson, setpublish_commentnameJson] = useState<any>(parseData('publish_comment_name',dataFormValues).lang_json_arr || []);
  const [user_likenameJson, setuser_likenameJson] = useState<any>(parseData('like_member_name',dataFormValues).lang_json_arr || []);
  const [group_likenameJson, setgroup_likenameJson] = useState<any>(parseData('like_group_name',dataFormValues).lang_json_arr || []);
  const [hashtag_likenameJson, sethashtag_likenameJson] = useState<any>(parseData('like_hashtag_name',dataFormValues).lang_json_arr || []);
  const [post_likenameJson, setpost_likenameJson] = useState<any>(parseData('like_post_name',dataFormValues).lang_json_arr || []);
  const [comment_likenameJson, setcomment_likenameJson] = useState<any>(parseData('like_comment_name',dataFormValues).lang_json_arr || []);
  
  const [user_follownameJson, setuser_follownameJson] = useState<any>(parseData('follow_member_name',dataFormValues).lang_json_arr || []);
  const [group_follownameJson, setgroup_follownameJson] = useState<any>(parseData('follow_group_name',dataFormValues).lang_json_arr || []);
  const [hashtag_follownameJson, sethashtag_follownameJson] = useState<any>(parseData('follow_hashtag_name',dataFormValues).lang_json_arr || []);
  const [post_follownameJson, setpost_follownameJson] = useState<any>(parseData('follow_post_name',dataFormValues).lang_json_arr || []);
  const [comment_follownameJson, setcomment_follownameJson] = useState<any>(parseData('follow_comment_name',dataFormValues).lang_json_arr || []);
  
  const [user_shieldnameJson, setuser_shieldnameJson] = useState<any>(parseData('shield_member_name',dataFormValues).lang_json_arr || []);
  const [group_shieldnameJson, setgroup_shieldnameJson] = useState<any>(parseData('shield_group_name',dataFormValues).lang_json_arr || []);
  const [hashtag_shieldnameJson, sethashtag_shieldnameJson] = useState<any>(parseData('shield_hashtag_name',dataFormValues).lang_json_arr || []);
  const [post_shieldnameJson, setpost_shieldnameJson] = useState<any>(parseData('shield_post_name',dataFormValues).lang_json_arr || []);
  const [comment_shieldnameJson, setcomment_shieldnameJson] = useState<any>(parseData('shield_comment_name',dataFormValues).lang_json_arr || []);
  
// 表单提交
const handleSubmitDataForm = (value:any,title:any) => {
  console.log(value,241)
  // setnameList(value)
  if(title == "member_id_name"){
    setSiteDescJson(value);
  }else if(title == "member_name_name"){
    setmnameNameJson(value);
  }else if(title == "member_role_name"){
    setrolenameJson(value);
  }else if(title == "member_nickname_name"){
    setnicknameJson(value);
  }else if(title == "member_name"){
    setmember_nameJson(value);
  }else if(title == "group_name"){
    setgroupnameJson(value);
  }else if(title == "hashtag_name"){
    sethashtagnameJson(value);
  }else if(title == "post_name"){
    setpostnameJson(value);
  }else if(title == "comment_name"){
    setcommentnameJson(value);
  }else if(title == "publish_post_name"){
    setpublish_postnameJson(value);
  }else if(title == "publish_comment_name"){
    setpublish_commentnameJson(value);
  }else if(title == "like_member_name"){
    setuser_likenameJson(value);
  }else if(title == "like_group_name"){
    setgroup_likenameJson(value);
  }else if(title == "like_hashtag_name"){
    sethashtag_likenameJson(value);
  }else if(title == "like_post_name"){
    setpost_likenameJson(value);
  }else if(title == "like_comment_name"){
    setcomment_likenameJson(value);
  }else if(title == "follow_member_name"){
    setuser_follownameJson(value);
  }else if(title == "follow_group_name"){
    setgroup_follownameJson(value);
  }else if(title == "follow_hashtag_name"){
    sethashtag_follownameJson(value);
  }else if(title == "follow_post_name"){
    setpost_follownameJson(value);
  }else if(title == "follow_comment_name"){
    setcomment_follownameJson(value);
  }else if(title == "shield_member_name"){
    setuser_shieldnameJson(value);
  }else if(title == "shield_group_name"){
    setgroup_shieldnameJson(value);
  }else if(title == "shield_hashtag_name"){
    sethashtag_shieldnameJson(value);
  }else if(title == "shield_post_name"){
    setpost_shieldnameJson(value);
  }else if(title == "shield_comment_name"){
    setcomment_shieldnameJson(value);
  }
  handleDataModalVisible(false)
}
  // 弹出框
  // @ts-ignore
  return <div className={styles.input}>
    <Card title={'用户命名设置'} className={styles.card} bordered={false}>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }}  label={'身份自定义名称'}>
            {form.getFieldDecorator('member_name', {
               initialValue: member_nameJson.length > 0 ? member_nameJson[0].lang_content : '',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('member_name');
                if(member_nameJson && member_nameJson.length>0){
                  setnameList(member_nameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“账号”、“用户”、“会员”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }}  label={'ID 自定义名称'}>
            {form.getFieldDecorator('member_id_name', {
               initialValue: siteDescJson.length > 0 ? siteDescJson[0].lang_content : '',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('member_id_name');
                if(siteDescJson && siteDescJson.length>0){
                  setnameList(siteDescJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“mid”、“uid”、“aid”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }}  label={'名称自定义名称'}>
            {form.getFieldDecorator('member_name_name', {
              initialValue: mnameNameJson.length>0?mnameNameJson[0].lang_content:'',
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('member_name_name');
                if(mnameNameJson && mnameNameJson.length>0){
                  setnameList(mnameNameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(JSON.parse(JSON.stringify(common.languagesOption)))));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“用户名”、“成员名”、“账号”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'昵称自定义名称'}>
            {form.getFieldDecorator('member_nickname_name', {
              initialValue: nicknameJson.length>0?nicknameJson[0].lang_content:'',
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('member_nickname_name');
                if(nicknameJson && nicknameJson.length>0){
                  setnameList(nicknameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“用户昵称”、“花名”、“代号”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'角色自定义名称'}>
            {form.getFieldDecorator('member_role_name', {
               initialValue: rolenameJson.length>0?rolenameJson[0].lang_content:'',
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('member_role_name');
                if(rolenameJson && rolenameJson.length>0){
                  setnameList(rolenameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“用户角色”、“用户组”、“用户群”等命名</span>
        </Col>
      </Row>
    </Card>

    <Card title={'内容命名设置'} className={styles.card} bordered={false}>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'小组自定义名称'}>
            {form.getFieldDecorator('group_name', {
              initialValue: groupnameJson.length>0?groupnameJson[0].lang_content:'',
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('group_name');
                if(groupnameJson && groupnameJson.length>0){
                  setnameList(groupnameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“版区”、“圈子”、“分类”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'话题自定义名称'}>
            {form.getFieldDecorator('hashtag_name', {
               initialValue: hashtagnameJson.length>0?hashtagnameJson[0].lang_content:'',
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('hashtag_name');
                if(hashtagnameJson && hashtagnameJson.length>0){
                  setnameList(hashtagnameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“超话”、“标签”、“话题”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'帖子内容名称'}>
            {form.getFieldDecorator('post_name', {
               initialValue: postnameJson.length>0?postnameJson[0].lang_content:'',
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('post_name');
                if(postnameJson && postnameJson.length>0){
                  setnameList(postnameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“帖子”、“动态”、“说说”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'评论内容名称'}>
            {form.getFieldDecorator('comment_name', {
               initialValue: commentnameJson.length>0?commentnameJson[0].lang_content:'',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('comment_name');
                if(commentnameJson && commentnameJson.length>0){
                  setnameList(commentnameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“评论”、“回复”、“互动”等命名</span>
        </Col>
      </Row>
    </Card>
    {/* <Divider></Divider> */}
    
    
    <Card title={'发表行为命名设置'} className={styles.card} bordered={false}>
    <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'发表帖子行为名称'}>
            {form.getFieldDecorator('publish_post_name', {
              initialValue: publish_postnameJson.length>0?publish_postnameJson[0].lang_content:'',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('publish_post_name');
                if(publish_postnameJson && publish_postnameJson.length>0){
                  setnameList(publish_postnameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
           
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“发表”、“投稿”、“反馈”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'发表评论行为名称'}>
          {form.getFieldDecorator('publish_comment_name', {
              initialValue: publish_commentnameJson.length>0?publish_commentnameJson[0].lang_content:'',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('publish_comment_name');
                if(publish_commentnameJson && publish_commentnameJson.length>0){
                  setnameList(publish_commentnameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“回复”、“回帖”、“跟帖”等命名
</span>
        </Col>
      </Row>
    </Card>
    <Card title={'点赞行为命名设置'} className={styles.card} bordered={false}>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'点赞用户行为'}>
            {form.getFieldDecorator('like_member_name', {
               initialValue: user_likenameJson.length>0?user_likenameJson[0].lang_content:'',
               // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
             })(<Input readOnly
               onClick={() => {
                 setFieldTitle('like_member_name');
                 if(user_likenameJson && user_likenameJson.length>0){
                   setnameList(user_likenameJson);
                 }else{
                   setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                 }
                 handleDataModalVisible(true);
                }}
           
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“点赞”、“喜欢”、“投一票”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'点赞小组行为'}>
            {form.getFieldDecorator('like_group_name', {
              initialValue: group_likenameJson.length>0?group_likenameJson[0].lang_content:'',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('like_group_name');
                if(group_likenameJson && group_likenameJson.length>0){
                  setnameList(group_likenameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“点赞”、“喜欢”、“投一票”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'点赞话题行为'}>
            {form.getFieldDecorator('like_hashtag_name', {
              initialValue: hashtag_likenameJson.length>0?hashtag_likenameJson[0].lang_content:'',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('like_hashtag_name');
                if(hashtag_likenameJson && hashtag_likenameJson.length>0){
                  setnameList(hashtag_likenameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“点赞”、“喜欢”、“投一票”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'点赞帖子行为'}>
            {form.getFieldDecorator('like_post_name', {
              initialValue: post_likenameJson.length>0?post_likenameJson[0].lang_content:'',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('like_post_name');
                if(post_likenameJson && post_likenameJson.length>0){
                  setnameList(post_likenameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“点赞”、“喜欢”、“顶一顶”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'点赞评论行为'}>
            {form.getFieldDecorator('like_comment_name', {
              initialValue: comment_likenameJson.length>0?comment_likenameJson[0].lang_content:'',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('like_comment_name');
                if(comment_likenameJson && comment_likenameJson.length>0){
                  setnameList(comment_likenameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“点赞”、“喜欢”、“顶一顶”等命名</span>
        </Col>
      </Row>
    </Card>
    <Card title={'关注行为命名设置'} className={styles.card} bordered={false}>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'关注用户行为'}>
            {form.getFieldDecorator('follow_member_name', {
              initialValue: user_follownameJson.length>0?user_follownameJson[0].lang_content:'',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('follow_member_name');
                if(user_follownameJson && user_follownameJson.length>0){
                  setnameList(user_follownameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
           
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“关注”、“喜欢”、“跟进”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'关注小组行为'}>
            {form.getFieldDecorator('follow_group_name	', {
              initialValue: group_follownameJson.length>0?group_follownameJson[0].lang_content:'',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('follow_group_name');
                if(group_follownameJson && group_follownameJson.length>0){
                  setnameList(group_follownameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“关注”、“加入”、“订阅”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'关注话题行为'}>
            {form.getFieldDecorator('follow_hashtag_name', {
              initialValue: hashtag_follownameJson.length>0?hashtag_follownameJson[0].lang_content:'',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('follow_hashtag_name');
                if(hashtag_follownameJson && hashtag_follownameJson.length>0){
                  setnameList(hashtag_follownameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“关注”、“订阅”、“跟进”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'关注帖子行为'}>
            {form.getFieldDecorator('follow_post_name', {
              initialValue: post_follownameJson.length>0?post_follownameJson[0].lang_content:'',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('follow_post_name');
                if(post_follownameJson && post_follownameJson.length>0){
                  setnameList(post_follownameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“收藏”、“喜欢”、“保存”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'关注评论行为'}>
            {form.getFieldDecorator('follow_comment_name', {
                 initialValue: comment_follownameJson.length>0?comment_follownameJson[0].lang_content:'',
                 // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
               })(<Input readOnly
                 onClick={() => {
                   setFieldTitle('follow_comment_name');
                   if(comment_follownameJson && comment_follownameJson.length>0){
                     setnameList(comment_follownameJson);
                   }else{
                     setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                   }
                   handleDataModalVisible(true);
                  }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“收藏”、“喜欢”、“保存”等命名</span>
        </Col>
      </Row>
    </Card>
    <Card title={'屏蔽行为命名设置'} className={styles.card} bordered={false}>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'屏蔽用户行为'}>
            {form.getFieldDecorator('shield_member_name', {
               initialValue: user_shieldnameJson.length>0?user_shieldnameJson[0].lang_content:'',
               // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
             })(<Input readOnly
               onClick={() => {
                 setFieldTitle('shield_member_name');
                 if(user_shieldnameJson && user_shieldnameJson.length>0){
                   setnameList(user_shieldnameJson);
                 }else{
                   setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                 }
                 handleDataModalVisible(true);
                }}
           
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“拉黑”、“屏蔽”、“讨厌”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'屏蔽小组行为'}>
            {form.getFieldDecorator('shield_group_name', {
               initialValue: group_shieldnameJson.length>0?group_shieldnameJson[0].lang_content:'',
               // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
             })(<Input readOnly
               onClick={() => {
                 setFieldTitle('shield_group_name');
                 if(group_shieldnameJson && group_shieldnameJson.length>0){
                   setnameList(group_shieldnameJson);
                 }else{
                   setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                 }
                 handleDataModalVisible(true);
                }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“不喜欢”、“不感兴趣”、“屏蔽”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'屏蔽话题行为'}>
            {form.getFieldDecorator('shield_hashtag_name', {
              initialValue: hashtag_shieldnameJson.length>0?hashtag_shieldnameJson[0].lang_content:'',
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Input readOnly
              onClick={() => {
                setFieldTitle('shield_hashtag_name');
                if(hashtag_shieldnameJson && hashtag_shieldnameJson.length>0){
                  setnameList(hashtag_shieldnameJson);
                }else{
                  setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                }
                handleDataModalVisible(true);
               }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“不喜欢”、“不感兴趣”、“屏蔽”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'屏蔽帖子行为'}>
            {form.getFieldDecorator('shield_post_name', {
               initialValue: post_shieldnameJson.length>0?post_shieldnameJson[0].lang_content:'',
               // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
             })(<Input readOnly
               onClick={() => {
                 setFieldTitle('shield_post_name');
                 if(post_shieldnameJson && post_shieldnameJson.length>0){
                   setnameList(post_shieldnameJson);
                 }else{
                   setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                 }
                 handleDataModalVisible(true);
                }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“不喜欢”、“不感兴趣”、“踩一踩”等命名</span>
        </Col>
      </Row>
      <Row>
        <Col span={14}>
          <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label={'屏蔽评论行为'}>
            {form.getFieldDecorator('shield_comment_name', {
               initialValue: comment_shieldnameJson.length>0?comment_shieldnameJson[0].lang_content:'',
               // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
             })(<Input readOnly
               onClick={() => {
                 setFieldTitle('shield_comment_name');
                 if(comment_shieldnameJson && comment_shieldnameJson.length>0){
                   setnameList(comment_shieldnameJson);
                 }else{
                   setnameList(JSON.parse(JSON.stringify(common.languagesOption)));
                 }
                 handleDataModalVisible(true);
                }}
             />)}
          </FormItem>
        </Col>
        <Col offset={1} span={7}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>例如“不喜欢”、“不感兴趣”、“踩一踩”等命名</span>
        </Col>
      </Row>
    </Card>
    <Col span={24}>
      <div style={{display: 'flex',justifyContent:'center',marginTop:20,}}>
        <Button type="primary" style={{marginLeft:30}} onClick={()=>{okHandle()}}>保存</Button>
      </div>
    </Col>
    {

    }
    <DataLang
        dataModalVisible={dataLangModalVisible}
        isUpdate={isUpdate}
        dataFormValues={dataFormValues}
        common={common || {}}
        // name={modalName}
        nameList={nameListLang}
        title={fieldTitle}
        onSubmit={handleSubmitDataForm}
        onCancel={() => handleDataModalVisible(false)}
    />
    {
      previewModelVisible && (
        <PreviewForm
          previewModelVisible={previewModelVisible}
          onVisibleModel={handlePreviewModalVisible}
          previewImg={previewImg}
        />
      )
    }
  </div>;
};

export default Form.create<DataFormProps>()(DataForm);
